<template>
  <div id="">
    <ul class="userMenu">
      <li v-for="(items,index) in usrMenuArr" :key="items.key">
        <router-link :to="{ path: items.urlName, query: {isLandlord:true }}">
          <img :src="items.imgUrl" alt="">
          <p>{{items.text}}</p>
        </router-link>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  name: "",
  data: () => ({
    usrMenuArr:[{
      imgUrl: require('@/assets/images/collectIcon@2x.png'),
      text:'我的收藏',
      urlName:'/myCollection'
    },{
      imgUrl: require('@/assets/images/recommend@2x.png'),
      text:'我的推荐',
      urlName:'/myIntroduce'
    },{
      imgUrl: require('@/assets/images/wallet@2x.png'),
      text:'我的钱包',
      urlName:'/landlordWallet'
    }]
  }),
}
</script>
<style lang="scss" scoped>

.userMenu{
  @include flex;
  background: white;
  text-align: center;
  padding: 10px 0;
  li{
    @include flexcell;
    color: $lightColor;
    img{
      width: 30px;
      margin-bottom: 10px;
    }
  }
}
</style>
